<template>
    <div id="aa">
        <span style="font-size: 30px;margin-left: 30px">收入统计</span>
        <el-row>
            <el-col :span="12">
                <div style="margin-left: 20px;margin-top: 20px">
                    <span>日期</span>
                    <el-date-picker
                            v-model="methodorYear.start"
                            type="date" size="medium" value-format="yyyy-MM-dd">
                    </el-date-picker>


                    <el-date-picker
                            v-model="methodorYear.end"
                            type="date" size="medium" value-format="yyyy-MM-dd">
                    </el-date-picker>
                    <el-button type="primary" icon="el-icon-search" style="margin-left: 10px" size="medium"
                               @click="myIncomeList">检索
                    </el-button>
                </div>
            </el-col>
            <el-col :span="12">
                <div style="margin-left: 30px;margin-top: 20px">
                    <el-button size="medium" @click="nearAMonth">近一个月</el-button>
                    <el-button size="medium" @click="nearThreeMonth">近三个月</el-button>
                    <el-button size="medium" @click="nearHalfYear">近半年</el-button>
                    <el-button size="medium" @click="nearAYear">近一年</el-button>
                </div>
            </el-col>
        </el-row>
        <h1 align="center" style="margin-top: 20px">湖北浅语律师事务所执业人员财务清单</h1>
        <div>
            <span style="margin-left: 30px">执业人员:</span>
            <span>{{empname}}</span>
            <span>日期:</span>
            <span>{{methodorYear.start}}</span>
            <span>至</span>
            <span>{{methodorYear.end}}</span>
        </div>
        <div style="margin-top: 20px;margin-left: 20px">
            <span style="font-weight: bold">律师日期内创收</span>
            <el-table
                    :data="pageResult.records"
                    style="width: 100%;margin-top: 30px" >
                <el-table-column
                        prop="empName"
                        label="承办律师">
                </el-table-column>
                <el-table-column
                        prop="caseNo"
                        label="案号">
                </el-table-column>
                <el-table-column
                        prop="caseWtr"
                        label="委托人">
                </el-table-column>
                <el-table-column
                        prop="caseOppositeParties"
                        label="对方当事人">
                </el-table-column>
                <el-table-column
                        prop="cwInoutDate"
                        label="收款日期">
                </el-table-column>
                <el-table-column
                        prop="cwInoutMoney"
                        label="收款金额">
                </el-table-column>
                <el-table-column
                        prop="cwRemark"
                        label="备注">
                </el-table-column>
            </el-table>
            <el-pagination
                    :page-size="pageResult.size"
                    @current-change="handleIndexChange" :current-page="pageResult.current"
                    :page-count="pageResult.pages" layout="prev, pager, next"
                    :total="pageResult.total">
            </el-pagination>
        </div>
        <div style="margin-top: 20px;margin-left: 20px">
            <span style="font-weight: bold">律师日期内创收提成</span>
            <el-table
                    :data="pageResult2.records"
                    style="width: 100%;margin-top: 30px">
                <el-table-column
                        prop="empName"
                        label="承办律师">
                </el-table-column>
                <el-table-column
                        prop="caseNo"
                        label="案号">
                </el-table-column>
                <el-table-column
                        prop="caseWtr"
                        label="委托人">
                </el-table-column>
                <el-table-column
                        prop="caseOppositeParties"
                        label="对方当事人">
                </el-table-column>
                <el-table-column
                        prop="casePaidsal"
                        label="创收金额">
                </el-table-column>
                <el-table-column
                        prop="cwRealSplitMoney"
                        label="实际提成">
                </el-table-column>
            </el-table>
            <el-pagination
                    :page-size="pageResult2.size"
                    @current-change="handleIndexChange2" :current-page="pageResult2.current"
                    :page-count="pageResult2.pages" layout="prev, pager, next"
                    :total="pageResult2.total">
            </el-pagination>
        </div>
        <div style="margin-top: 30px">
            <el-card>
                <div slot="header" class="clearfix">
                    <span style="font-size: 20px;font-weight: 700">实际收入</span>
                </div>
                <div>
                    <ul style="list-style: none">
                        <li><span style="font-size: 20px">基本工资</span><span style="margin-left: 51px"><i
                                class="el-icon-circle-plus"></i></span><span style="margin-left: 151px;font-size: 18px">{{myIncomeSr.cwBasicSalary}}</span>
                        </li>
                        <li><span style="font-size: 20px">级别工资</span><span style="margin-left: 51px"><i
                                class="el-icon-circle-plus"></i></span><span style="margin-left: 151px;font-size: 18px">{{myIncomeSr.cwLevelSalary}}</span>
                        </li>
                        <li><span style="font-size: 20px">实际提成</span><span style="margin-left: 51px"><i
                                class="el-icon-circle-plus"></i></span><span style="margin-left: 151px;font-size: 18px">{{myIncomeSr.cwRealSplitMoney}}</span>
                        </li>
                        <li><span style="font-size: 20px;font-weight: 600">合计</span><span style="font-size: 20px;font-weight: 600;margin-left: 258px">{{myIncomeSr.sum}}</span></li>
                    </ul>
                </div>
            </el-card>
        </div>
        <!--<div>-->
            <!--<button @click="exportExcel">点击导出</button>-->
        <!--</div>-->

    </div>
</template>

<script>
    import MyIncomeService from '../../../model/ww/cw_inout/MyIncomeService'
    import MyIncomeCsService from '../../../model/ww/cw_inout/MyIncomeCsService'
    import CwEmpincomeService from '../../../model/ww/cw_inout/CwEmpincomeService'

    const myIncomeService = MyIncomeService.getInstance();
    const myIncomeCsService = MyIncomeCsService.getInstance();
    const cwEmpincomeService = CwEmpincomeService.getInstance();
    // import FileSaver from "file-saver";
    // import XLSX from "xlsx";

    export default {
        name: "myIncome",
        data() {
            return {
                pageResult: [],
                params: {},
                pageResult2: [],
                params2: {},
                myIncomeSr: {},
                sumSr:[],
                aa:{},
                methodorYear:{
                    start:'',
                    end:''
                },
                empname:''
            }
        },
        methods: {
            myIncomeList() {
                //开始时间
                var start=this.methodorYear.start
                //截止时间
                var end=this.methodorYear.end
                //params添加时间
                this.params.start=start
                this.params.end=end
                //params2添加时间
                this.params2.start=start;
                this.params2.end=end;
                //aa添加时间
                this.aa.start=start;
                this.aa.end=end;
                //律师日期内创收
                this.myIncomeList1(this.params)
                //律师日期内创收提成
                this.myIncomeCsList(this.params2)
                //计算收入总和
                this.cwEmpincomeList(this.aa)
            },
            // 律师日期内创收
            myIncomeList1(params){
                myIncomeService.myIncomeList(params).then((response) => {
                    this.pageResult = response.data.data
                })
            }
         ,
            myIncomeCsList(params2){
                myIncomeCsService.myIncomeCsList(params2).then((response) => {
                    this.pageResult2 = response.data.data
                })
            }
        ,
            //分页改变事件
            handleIndexChange(index) {
                this.params.page = index
                this.myIncomeList(this.params)
            },
            //第二表格分页改变事件
            handleIndexChange2(index2) {
                this.params2.page = index2
                this.myIncomeCsList(this.params2)
            },
            //实际收入
            cwEmpincomeList(aa) {
                cwEmpincomeService.cwEmpincomeList(aa).then((response) => {
                    this.myIncomeSr = response.data.data
                    this.sunSalary(this.myIncomeSr)
                })
            },
            //计算实际收入
            sunSalary(myIncomeSr){
               var s= myIncomeSr
                this.myIncomeSr={
                    cwBasicSalary:0,
                    cwLevelSalary:0,
                    cwPensionInsurance:0,
                    cwIndividualIncomeTax:0,
                    cwAttendanceDeduction:0,
                    cwOvertimeWage:0,
                    cwRealSplitMoney:0
                }
                //循环数组赋值
                for (let i = 0; i < s.length; i++) {
                    this.myIncomeSr.cwBasicSalary+=s[i].cwBasicSalary
                    this.myIncomeSr.cwLevelSalary+=s[i].cwLevelSalary
                    this.myIncomeSr.cwRealSplitMoney+=Number(s[i].cwRealSplitMoney)

                }
                //计算总收入
                this.myIncomeSr.sum=this.myIncomeSr.cwBasicSalary+this.myIncomeSr.cwLevelSalary +(Number(this.myIncomeSr.cwRealSplitMoney))


            },nearAMonth(){
                var date=new Date();
                var year;
                var month;
                if((date.getMonth()+1)==1){
                    year=date.getFullYear()-1;
                    month=12;
                }else{
                    year=date.getFullYear();
                    month=date.getMonth()-1;
                }

                this.methodorYear.start=year+"-"+month+"-"+date.getDate();
                this.methodorYear.end=date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();
                this.myIncomeList1(this.methodorYear);
                this.myIncomeCsList(this.methodorYear);
                this.cwEmpincomeList(this.methodorYear);
                // //恢复默认值,表单的日期输入框
                // this.methodorYear.start='';
                // this.methodorYear.end='';
            },
            nearThreeMonth(){
                var now = new Date();
                var year = now.getFullYear();
                var month = now.getMonth() + 1;//0-11表示1-12月
                var day = now.getDate();
                var dateObj = {};
                var last3MonthDay;
                dateObj.now = year + '-' + month + '-' + day;
                var nowMonthDay = new Date(year, month, 0).getDate();    //当前月的总天数
                if(month - 3 <= 0){ //如果是1、2、3月，年数往前推一年
                    last3MonthDay = new Date((year - 1), (12 - (3 - parseInt(month))), 0).getDate();    //3个月前所在月的总天数
                    if(last3MonthDay < day){    //3个月前所在月的总天数小于现在的天日期
                        dateObj.last = (year - 1) + '-' + (12 - (3 - month)) + '-' + last3MonthDay;
                    }else{
                        dateObj.last = (year - 1) + '-' + (12 - (3 - month)) + '-' + day;
                    }
                }else{
                    last3MonthDay = new Date(year, (parseInt(month) - 3), 0).getDate();    //3个月前所在月的总天数
                    if(last3MonthDay < day){    //3个月前所在月的总天数小于现在的天日期
                        if(day < nowMonthDay){        //当前天日期小于当前月总天数,2月份比较特殊的月份
                            dateObj.last = year + '-' + (month - 3) + '-' + (last3MonthDay - (nowMonthDay - day));
                        }else{
                            dateObj.last = year + '-' + (month - 3) + '-' + last3MonthDay;
                        }
                    }else{
                        dateObj.last = year + '-' + (month - 3) + '-' + day;
                    }
                }

                this.methodorYear.start=dateObj.last;
                this.methodorYear.end=now.getFullYear()+"-"+(now.getMonth()+1)+"-"+now.getDate();
                this.myIncomeList1(this.methodorYear);
                this.myIncomeCsList(this.methodorYear);
                this.cwEmpincomeList(this.methodorYear);
                // //恢复默认值,表单的日期输入框
                // this.methodorYear.start='';
                // this.methodorYear.end='';
            },
            nearHalfYear(){
                let data = new Date();
                // 获取年份
                let year = data.getFullYear();
                // 获取月份
                let mon = data.getMonth() + 1;
                let array = new Array();
                for (let i = 0; i < 6; i++) {
                    mon = mon - 1;
                    if (mon <= 0) {
                        year = year - 1;
                        mon = mon + 12;
                    }
                    if (mon < 10) {
                        mon = "0" + mon;
                    }
                    array[i] = year + "-" + mon + "-" + data.getDate();
                }
                this.methodorYear.start=array[array.length-1];
                this.methodorYear.end=data.getFullYear()+"-"+(data.getMonth()+1)+"-"+data.getDate();
                this.myIncomeList1(this.methodorYear);
                this.myIncomeCsList(this.methodorYear);
                this.cwEmpincomeList(this.methodorYear);
                // //恢复默认值,表单的日期输入框
                // this.methodorYear.start='';
                // this.methodorYear.end='';
            },
            nearAYear(){
                var date=new Date();
                var lastYear=(date.getFullYear()-1)+"-"+(date.getMonth()+1)+"-"+date.getDate();
                this.methodorYear.start=lastYear;
                this.methodorYear.end=date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate();
                this.myIncomeList1(this.methodorYear);
                this.myIncomeCsList(this.methodorYear);
                this.cwEmpincomeList(this.methodorYear);
                // this.methodorYear.start='';
                // this.methodorYear.end='';
            },
            // //账单导出
            // exportExcel(){
            //     /* 从表生成工作簿对象 */
            //     let wb = XLSX.utils.table_to_book(document.querySelector('#aa'))
            //     /* 获取二进制字符串作为输出 */
            //     var wbout = XLSX.write(wb, {
            //         bookType: 'xlsx',
            //         bookSST: true,
            //         type: 'array'
            //     })
            //     try {
            //         FileSaver.saveAs(
            //             //Blob 对象表示一个不可变、原始数据的类文件对象。
            //             //Blob 表示的不一定是JavaScript原生格式的数据。
            //             //File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
            //             //返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成。
            //             new Blob([wbout], { type: 'application/octet-stream' }),
            //             //设置导出文件名称
            //             'sheetjs.xlsx'
            //         )
            //     } catch (e) {
            //         if (typeof console !== 'undefined') console.log(e, wbout)
            //     }
            //     return wbout
            // }


        },
        created() {
            this.empname=sessionStorage.getItem("realName")
        }
    }
</script>

<style scoped>
    span {
        margin-left: 10px;
    }
</style>